<!DOCTYPE html>
<html>
<head>
<style>
section {
	margin-bottom: 30px
}

section header {
	font-weight: bolder;
	padding-bottom: 10px;
}

.amount {
	width: 200px;
	text-align: right;
	border: 1px solid #aaa;
	background-color: #eee;
	padding: 3px 8px;
}

.msg {
	width: 80%;
	padding: 8px;
	margin-bottom: 20px;
	border: 1px solid #aaa;
	background-color: #dfb;
}

.msg.error {
	background-color: #ffbeb8;
}
</style>
<script src="/js/jquery-1.11.3.min.js"></script>
<script src="/js/jquery-ajax-ext.js"></script>
<script src="/js/gosqlgo.js"></script>
<script>
	aamount = qry('"select amount from account where id=?", param("A"), " and amount<>?", param(0)','A','0'); //TODO use java as template
	bamount = java(
			'try{ '
			+' Long amount=iQueryForLongValue("select amount from account where id=?", param("B")," and amount<>?", param(0)); '
			+ '  return amount.toString();'
			+ '}catch(Exception e){'
			+'	return "0"; '
			+'} ' 
			);
</script>
</head>
<body>
	<h1>Transaction Demo</h1>
	<div class="msgs"></div> 
	<section>
		<header>Account A</header>
		<div id="A" class="amount">
			<script>
				document.write(aamount);
			</script>
		</div>
	</section>
	<section>
		<header>Account B</header>
		<div id="B" class="amount">
			<script>
				document.write(bamount);
			</script>
		</div>
	</section>
	<section>
		<header>Transfer</header>
		<form action="/trans.do" method="post">
			<input name="amount" value="100" class="amount">
			<button name="btnA2B" value="true">From account A to account
				B</button>
			<button name="btnB2A" value="true">From account B to account
				A</button>
		</form>
	</section>
</body>
</html>